<template>
    <div>
        <h2>我是主页</h2>
        <p>哈哈哈哈</p>
        <!-- 这是主页的子组件，所以，对于引用，判断在什么位置，我们都直接通过主页来显示 -->
        <router-link to="/home/homeMessage">主页消息</router-link>
        <router-link to="/home/homeNews">消息</router-link>
        <router-view></router-view>
    </div>
</template>

<script>
export default {
    name:"home",
    created(){
        // 生命周期创造
        console.log("home created");
    },
    destroyed(){
        // 生命周期销毁
        console.log('home destroyed');
    },
    // activated与deactivated是必须要与keep-alive结合起来用的
    activated(){
        // 处于活跃状态
        this.$router.push(this.path)
    },
    deactivated(){
        //处于非活跃状态
    },
    // 组件内的导航守卫
    beforeRouteLeave(to ,from , next){
        console.log(this.$route.path);
        this.path = this.$route.path;
        // $route是记录活跃状态下的
        next();
    }
}
</script>

<style scoped>

</style>